<template>
  <div class="body-layout">
    <header class="top-header">
      <!-- 返回按钮 -->
      <a @click="$router.back(-1);" class="header-left"></a>
      <article class="header-middle">发表评论</article>
    </header>
    <div class="marginTop44">
      <div class="vf-evaluate">
        <p>您正在对“{{viewTitle}}”发表评论</p>
        <textarea class="textarea" placeholder="有话要说..." maxlength="500" v-model="commentContent"></textarea>
        <button type="button" class="phone-btn" @click="handleSubmitClick">提 交</button>
      </div>
    </div>
  </div>
</template>

<script>
  import util from '@/lib/util.js'

  export default {
    name: 'Comment',
    data() {
      return {
        view_id: '',
        viewTitle: '',
        commentContent: ''
      }
    },
    created: function () {
      util.vars.in_time = new Date().getTime();
    },
    methods: {
      getComment() {
        if (this.commentContent == '') {
          this.$toast('请填写评论', {
            duration: '1000'
          })
        }
        else {
          util.ajax.post('/comment/post', util.jsonStringify({
            view_id: this.view_id,
            content: this.commentContent
          })).then((res) => {
            if (res.code === 1 && res.data) {
              var that = this;
              that.commentContent = "";
              this.$toast('提交成功', {
                duration: '1000'
              });
              setTimeout(function () {
                that.$router.push({path: '/pages/Detail', query: {id: that.view_id, t: Date.now()}});
              }, 1500)
            } else {
              this.$toast('提交失败,' + res.msg || "请稍后重试", {
                duration: '2000'
              })
            }
          });
        }
      },

      getViewDetail() {
        util.ajax.get(`/view/detail?view_id=${this.view_id}`).then((res) => {
          this.viewTitle = res.data.view_title;
        });
      },

      handleSubmitClick() {
        this.getComment();
      }
    },
    mounted() {
      this.view_id = this.$route.query.id;
      this.getViewDetail();
    }
  }
</script>

<style>
</style>
